import 'package:flutter/material.dart';

class HomeScreen extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: DefaultTabController(
        length: types.length,
        child: Scaffold(
          appBar: AppBar(
//            leading: RaisedButton(
//              color: Colors.blue,
//              onPressed: () {Navigator.pop(context);},
//              child: Icon(
//                  Icons.arrow_back,
//                color: Colors.white,
//              ),
//            ) ,
            title: Text('这是Tabbar'),
            bottom: TabBar(
              isScrollable: true,
              tabs: types.map<Widget>((Types type) {
                return Tab(
                  text: type.name,
                  icon: Icon(type.icon),
                );
              }).toList(),
            ),
          ),
          body: TabBarView(
            children: types.map<Widget>((Types type) {
              return TypesCard (
                types: type,
              );
            }).toList(),
          ),
        ),
      ),
    );

  }
}

class Types {
  const Types({this.icon,this.name});
  final IconData icon;
  final String name;
}

const List<Types> types = <Types> [
  Types(icon:Icons.add_alarm, name:"酒水"),
  Types(icon:Icons.remove_from_queue, name:"水果"),
  Types(icon:Icons.ac_unit, name:"生鲜"),
  Types(icon:Icons.print, name:"零食"),
  Types(icon:Icons.accessible_forward, name:"女装"),
  Types(icon:Icons.add_shopping_cart, name:"数码"),
  Types(icon:Icons.attach_file, name:"玩具"),
  Types(icon:Icons.card_travel, name:"母婴"),
];

class TypesCard extends StatelessWidget {

  const TypesCard({Key key,this.types}):super(key :key);

  final Types types;

  @override
  Widget build(BuildContext context) {
    final TextStyle textStyle = Theme.of(context).textTheme.display1;
    return Card(
      color: Colors.lightGreenAccent,
      child: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Icon(types.icon, size: 128.0, color: textStyle.color),
            Text(types.name, style: textStyle),
          ],
        ),
      ),
    );
  }
}